<template>
	<view class="popBox" v-if="pupoCode">
		<view class="popupVal">
			<view class="popopoppo">
				<view class="popupCun" @click="getPupo">
					<image src="../static/codeImg/组 12161@2x.png" class="popuimg"></image>
				</view>
				<view class="ValtextTop">
					<text>了解户型报价</text>
				</view>
				<view class="ValtextCen">
					<text>足不出户了解户型报价</text>
				</view>
				<view class="ValButCen-1">
					<input type="number" class="signUpTable" placeholder="请输入您的手机号码" placeholder-class="placeholStyle"
						v-model="upPopuRell">
				</view>
				<view>
					<button class="signUpbutton" @click="add">提交</button>
				</view>
				<view class="signUpCheck">
					<checkbox-group>
						<checkbox :checked="checkCode" @click="changeCheckbox" class="chaneck" /><span>阅读并同意 <text
								style="color: #FF5500;" @click="userAgre">《用户服务协议》</text></span>
					</checkbox-group>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			puporCode: {
				type: String,
				default: ""
			},
			propertiesID: {
				type: String,
				default: ""
			}

		},
		data() {
			return {
				pupoCode: this.puporCode,
				properties_id:this.propertiesID,
				upPopuRell: "",
				checkCode: false
			}
		},

		methods: {
			add() {
				if (this.upPopuRell === '') {
					uni.showToast({
						title: '手机号不能为空',
						icon: 'none',
					});
					return

				} else {
					if (!/^1[3456789]\d{9}$/.test(this.upPopuRell)) {
						uni.showToast({
							title: '请输入正确的手机号',
							icon: 'none',
						});
						return
					}
				}
				if (this.checkCode == false) {
					uni.showToast({
						title: '请阅读并同意《用户服务协议》',
						icon: 'none',
					});
					return
				}
				this.$api('api/properties/quotation', 'GET',{properties_id:this.properties_id,mobile:this.upPopuRell}).then(res => {
					console.log("----------res", res, "----------upPopuRell", this.upPopuRell);
					if (res.code == '1') {
						uni.showToast({
							title: '报价提交成功',
							icon: 'none',
						});
						return
					}
				})
				
			},
			changeCheckbox() {
				this.checkCode = !this.checkCode
			},
			getPupo() {
				this.pupoCode = false
			},
			userAgre() {
				uni.navigateTo({
					url: `/pages/mySubPack/userAgreement/userAgreement`
				});
			}
		}
	}
</script>

<style>
	.popBox {
		width: 750rpx;
		min-height: 100vh;
		background: rgba(10, 10, 10, 0.5);
		position: relative;
	}

	.popopoppo {
		width: 562rpx;
		margin: 38rpx auto;
		/* border: 1rpx solid red; */
	}

	.popupVal {
		width: 648rpx;
		/* height: 690rpx; */
		background: linear-gradient(180deg, #FFD0CC 0%, #FFFFFF 50%);
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.popupCun {
		width: 100%;
		height: 100%;
		text-align: right;
	}

	.popuimg {
		width: 24rpx;
		height: 24rpx;
	}

	.ValtextTop {
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 36rpx;
		color: #333333;
		text-align: left;
		font-style: normal;
		text-transform: none;
		margin-bottom: 8rpx;
	}

	.ValtextCen {
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 26rpx;
		color: #A3A3A3;
		text-align: left;
		font-style: normal;
		text-transform: none;
		margin-bottom: 46rpx;
	}

	.signUpTable {
		height: 76rpx;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
		border: 2rpx solid #E9EBEA;
		margin-bottom: 52rpx;
	}

	.placeholStyle {
		margin-left: 26rpx;
	}

	.signUpbutton {
		width: 562rpx;
		height: 72rpx;
		background: #FF5500;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 30rpx;
		color: #FFFFFF;
		text-align: center;
		font-style: normal;
		text-transform: none;
		margin-bottom: 22rpx;
	}

	.signUpCheck {
		width: 100%;
		text-align: center;
	}

	.chaneck {
		transform: scale(0.8, 0.8);
	}
</style>
